<!-- 项目成本 -->
<template>
  <div class="content">
    <div style="display: flex; justify-content: space-between; margin-top: 20px;">
      <budget-analysis :tabNum="tabNum" class="budget-analysis"/>
      <cost-components :tabNum="tabNum" class="cost-components"/>
    </div>
    <div style="display: flex; justify-content: space-between; margin-top: 20px;">
      <budget-use :tabNum="tabNum" class="budget-use" />
      <person-work-hours :tabNum="tabNum" class="person-work-hours" />
    </div>
  </div>
</template>

<script>
import BudgetAnalysis from './budgetAnalysis'
import BudgetUse from './budgetUse'
import CostComponents from './costComponents'
import PersonWorkHours from './personWorkHours'
export default {
  components: { BudgetAnalysis, CostComponents, BudgetUse, PersonWorkHours },
  props: {
    tabNum: {
      type: String,
      default: '0'
    }
  }
}
</script>

<style lang="scss" scoped>
.content {
  .budget-analysis,.cost-components,.budget-use,.person-work-hours {
    width: 49.2%;
    height: 450px;
  }
  .budget-use,.person-work-hours {
    height: 600px;
  }
}
</style>